<!--
 * @Description:  
 * @Author: YiHe
 * @Date: 2020-07-03 08:41:38
 * @LastEditors: YiHe
 * @LastEditTime: 2020-12-11 14:13:15
-->
<template>
	<view class="head" @tap="toUser"
		><image :src="user.avatarUrl ? user.avatarUrl : '../../static/icon/head_logo.png'" mode="aspectFill"></image>
		<u-tag v-if="user" class="tag" :text="text" size="mini" shape="circle" type="warning" />
	</view>
</template>

<script>
import Vue from 'vue'
export default {
	data() {
		return {
			user: {},
			text: '家长',
		}
	},
	created() {
		this.loadData()
	},
	methods: {
		loadData: async function () {
			//用户deviceUuid没有获取则轮训获取 直到获取成功
			if (!this.deviceUuid) {
				const timer = setTimeout(() => {
					this.loadData()
				}, 300)
				this.$once('hook:beforeDestory', function () {
					clearTimeout(timer)
				})
				return
			}
			const [data, err] = await this.awaitWarp(this.$post(this.api.loadUserData, { deviceUuid: this.deviceUuid }))
			Vue.prototype.user = data.user
			this.user = data.user
			if (this.hasMerchant) this.text = '机构'
			if (this.hasExpert) this.text = '专家'
		},
		toUser: function () {
			this.$Router.push({ name: 'user' })
		},
	},
}
</script>

<style scoped lang="stylus">
.head
	width 100rpx
	height 100rpx
	overflow hidden
	transform translate3d(0, 0, 0)
	position relative

	image
		width 100%
		height 100%
		position absolute
		border-radius 50%

	.tag
		position absolute
		bottom 0
		z-index 99
		right 0
</style>
